<template>
  <menuTree :type="type" :id="id" @saved="saveRights" />
</template>
<script setup>
  import { useRoute, useRouter } from 'vue-router';
  import { ref, inject, defineAsyncComponent, onMounted } from 'vue';

  const menuTree = defineAsyncComponent(() => import('./components/MenuTree.vue'));

  const $route = useRoute();
  const $router = useRouter();

  const $http = inject('$http');
  const $message = inject('$message');

  const id = ref(0);
  const type = ref('user');

  function saveRights(menus) {
    $http.post(`/api/menu/${type.value == 'user' ? 'user' : 'role'}/${id.value}/rights`, menus).then(res => {
      if (res.success) {
        $message.success('保存成功！');
      }
    });
  }

  onMounted(() => {
    id.value = $route.query.id;
    type.value = $route.query.type;
  });
</script>
